
.login1 {
  width: 100vw;
  height: 100vh;
  background-image: linear-gradient(#a18cd1 0%, #fbc2eb 100%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;

  .login_wapper {
    width: 600px;
    //min-height: 520px;
    background-color: rgba(87, 86, 86, 0.2);
    border-radius: 25px;
    box-shadow: 5px 2px 35px -7px #ff9a9e;
    padding-bottom: 50px;
    .title{
      margin: 40px 0;
      color: aliceblue;
      font-weight: 100;
      text-align: center;
      font-size: 24px;
    }
    p {
      span{
        color: #409eff;
        cursor: pointer;
      }
    }
    .login_form{
      display: flex;
      flex-direction: column;
      align-items: center;
      .row{
        display: flex;
        align-items: center;
        .key{
          width: 100px;
          text-align: right;
          color: rgb(131, 220, 255);
          font-size: 18px;
          font-weight: 100;
        }
        input{
          background-color: transparent;
          width: 320px;
          padding: 2px;
          text-indent: 2px;
          color: white;
          font-size: 20px;
          height: 45px;
          margin: 30px 30px 30px 5px;
          outline: none;
          border: 0;
          border-bottom: 1px solid rgb(131, 220, 255);
        }
      }
    }

    .long-btn{
      background-color: rgba(255, 255, 255, 0.582);
      border: 1px solid rgb(190, 225, 255);
      padding: 10px;
      width: 240px;
      height: 60px;
      border-radius: 50px;
      font-size: 30px;
      color: white;
      font-weight: 100;
      margin: 15px auto 0 auto;
      display: flex;
      align-items: center;
      justify-content: center;
      &:hover{
        box-shadow: 2px 2px 15px 2px rgb(190 225 255);
        background-color: transparent;
        animation: login_mation 0.5s;
      }
    }
  }
}